<template>
  <el-row class="tac" :style="{ height: backgroundHeight + 'px'}">
    <el-col :span="24" class="scrollable-menu">
      <h2 class="mb-2">希望信工提供的学生服务</h2>
      <el-menu
          default-active="2"
          class="el-menu-vertical-demo"
          @open="handleOpen"
          @close="handleClose"
      >
        <el-menu-item index="1" @click="onMenuItemfiyfishwebClick()">
          <el-icon>
            <Connection/>
          </el-icon>
          <span>可视化编程</span>
        </el-menu-item>
        <el-menu-item index="2" @click="onMenuItemGptClick()">
          <el-icon>
            <Connection/>
          </el-icon>
          <span>AI工具</span>
        </el-menu-item>
        <el-menu-item index="3" @click="onMenuItemDrwaIOClick()">
          <el-icon>
            <Connection/>
          </el-icon>
          <span>论文画图工具</span>
        </el-menu-item>
        <el-menu-item index="4" @click="onMenuItemPaperDetectionClick()">
          <el-icon>
            <Connection/>
          </el-icon>
          <span>超级论文检测</span>
        </el-menu-item>
        <el-menu-item index="5" @click="onMenuItemDownloadSiteClick()">
          <el-icon>
            <Connection/>
          </el-icon>
          <span>希望信工下载站</span>
        </el-menu-item>
      </el-menu>
    </el-col>
  </el-row>
</template>

<script setup>
import {
  Document,
  Menu as IconMenu,
  Location,
  Setting, Message, EditPen,
  Connection
}
  from '@element-plus/icons-vue'
import setting from "@/setting.js";
import {computed, getCurrentInstance, onMounted, ref} from 'vue';
import {ElMessage} from 'element-plus';
import eventBus from "@/event-bus.js";
import {jsonApi} from "@/global.js";
//高度定义
const backgroundHeight=ref(720);


//事件定义
const emit = defineEmits(['open-gpt-web','open-score-statistics-table']);

// 初始化报告信息
const reportInfo = ref([]);
// 在组件挂载后从localStorage读取数据
onMounted(() => {
  const storedReportInfo = localStorage.getItem('reportinfo');
  if (storedReportInfo) {
    reportInfo.value = JSON.parse(storedReportInfo);
  }
  backgroundHeight.value = window.innerHeight;
});
const handleOpen = (key, keyPath) => {
  console.log(key, keyPath)
}

const handleClose = (key, keyPath) => {
  console.log(key, keyPath)
}
const onMenuItemfiyfishwebClick = async () => {
  //跳转到flyfish界面 setting.APT_URL + 'admin'
  const url='https://flyfish.swjtuhc.top:1443/'
  window.open(url, '_blank');

}
const onMenuItemGptClick= async () => {
  // 显示GptDisplayer组件
  emit('openFormsTable','GptDisplay');


};




//画图工具
const onMenuItemDrwaIOClick = async () => {
  //跳转到flyfish界面 setting.APT_URL + 'admin'
  const url='https://drawio.swjtuhc.top:1443';
  window.open(url, '_blank');

}

// 论文检测
const onMenuItemPaperDetectionClick = async () => {
  //跳转到flyfish界面 setting.APT_URL + 'admin'
  const url='https://paperdec.swjtuhc.top:1443/';
  emit('open-gpt-web',url);

}
//下载站
const onMenuItemDownloadSiteClick = async () => {
  //跳转到flyfish界面 setting.APT_URL + 'admin'
  const url='https://nextcloud.swjtuhc.top:1443/s/wjSKKxmiK6s9iGZ';
  window.open(url, '_blank');

}

</script>
<style scoped>
/* 添加滚动条样式 */
.scrollable-menu {
  overflow-y: auto;
  /* 可根据需要设置最大高度，例如：
  max-height: 80vh; */
}
</style>